<title>列表组合</title>

<div class="content-header row">
	 <div class="content-header-left col-md-8 col-12 mb-2 breadcrumb-new">
	 	<h3 class="content-header-title mb-0 d-inline-block">列表组合</h3>
	 	<div class="row breadcrumbs-top d-inline-block">
	 		<div class="breadcrumb-wrapper mr-1">
	 			<ol class="breadcrumb">
	 				<li class="breadcrumb-item"><a href="/dashboard" class="menu-router">首页</a></li>
	 				<li class="breadcrumb-item"><a href="javascript:;">组件</a></li>
	 				<li class="breadcrumb-item active">列表组合</li>
	 			</ol>
	 		</div>
	 	</div>
	 </div>
</div>

<div class="content-body">
<!-- Basic ListGroups start -->
<section id="basic-listgroup">
	<div class="row match-height">
		<div class="col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Basic Example</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li>
								<a data-action="collapse">
									<i class="ft-minus"></i>
								</a>
							</li>
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>
							<li>
								<a data-action="expand">
									<i class="ft-maximize"></i>
								</a>
							</li>
							<li>
								<a data-action="close">
									<i class="ft-x"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<p>The most basic list group is simply an unordered list with list items, and the proper classes. Build upon it with the
							options that follow, or your own CSS as needed.</p>
						<ul class="list-group">
							<li class="list-group-item">Cras justo odio</li>
							<li class="list-group-item">Dapibus ac facilisis in</li>
							<li class="list-group-item">Morbi leo risus</li>
							<li class="list-group-item">Porta ac consectetur ac</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<div class="col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Active items</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li>
								<a data-action="collapse">
									<i class="ft-minus"></i>
								</a>
							</li>
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>
							<li>
								<a data-action="expand">
									<i class="ft-maximize"></i>
								</a>
							</li>
							<li>
								<a data-action="close">
									<i class="ft-x"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<p>Add
							<code>.active</code> to a
							<code>.list-group-item</code> to indicate the current active selection.</p>
						<ul class="list-group">
							<li class="list-group-item active">Cras justo odio</li>
							<li class="list-group-item">Dapibus ac facilisis in</li>
							<li class="list-group-item">Morbi leo risus</li>
							<li class="list-group-item">Vestibulum at eros</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Basic ListGroups end -->

<!-- Disabled ListGroups start -->
<section id="disabled-listgroup">
	<div class="row match-height">
		<div class="col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Disabled items</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li>
								<a data-action="collapse">
									<i class="ft-minus"></i>
								</a>
							</li>
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>
							<li>
								<a data-action="expand">
									<i class="ft-maximize"></i>
								</a>
							</li>
							<li>
								<a data-action="close">
									<i class="ft-x"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<p>Add
							<code>.disabled</code> to a
							<code>.list-group-item</code> to gray it out to appear disabled.</p>
						<div class="list-group">
							<a href="#" class="list-group-item disabled">
								Cras justo odio
							</a>
							<a href="#" class="list-group-item">Dapibus ac facilisis in</a>
							<a href="#" class="list-group-item">Morbi leo risus</a>
							<a href="#" class="list-group-item">Porta ac consectetur ac</a>
							<a href="#" class="list-group-item">Vestibulum at eros</a>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Flush</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li>
								<a data-action="collapse">
									<i class="ft-minus"></i>
								</a>
							</li>
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>
							<li>
								<a data-action="expand">
									<i class="ft-maximize"></i>
								</a>
							</li>
							<li>
								<a data-action="close">
									<i class="ft-x"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<p>Add
							<code>.list-group-flush</code> to remove some borders and rounded corners to render list group items edge-to-edge in a parent container (e.g., cards).</p>
						<ul class="list-group list-group-flush">
							<li class="list-group-item">Cras justo odio</li>
							<li class="list-group-item">Dapibus ac facilisis in</li>
							<li class="list-group-item">Morbi leo risus</li>
							<li class="list-group-item">Porta ac consectetur ac</li>
							
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Disabled ListGroups end -->

<!-- With Other Option start -->
<section id="with-other-options">
	<div class="row">
		<div class="col-12 mt-3 mb-1">
			<h4 class="text-uppercase">With Other Options</h4>
		</div>
	</div>
	<div class="row match-height">
		<div class="col-xl-4 col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Badges</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis-h font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">							
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>							
						</ul>
					</div>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Add bagdes to any list group item to show unread counts, activity, etc.</p>
						<ul class="list-group">
							<li class="list-group-item">
								<span class="badge badge-primary badge-pill float-right">5</span>
								Cras justo odio
							</li>
							<li class="list-group-item">
								<span class="badge badge-success badge-pill float-right">2</span>
								Dapibus ac facilisis in
							</li>
							<li class="list-group-item">
								<span class="badge badge-danger badge-pill float-right">1</span>
								Morbi leo risus
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-4 col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Labels</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis-h font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">							
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>							
						</ul>
					</div>
				</div>
				<div class="card-content">
					<div class="card-body">
						<p>Add labels to any list group item to show notifications, message,etc.</p>
						<ul class="list-group">
							<li class="list-group-item">
								<span class="badge badge-warning float-right">Warning</span>
								Cras justo odio
							</li>
							<li class="list-group-item">
								<span class="badge badge-info float-right">info</span>
								Dapibus ac facilisis in
							</li>
							<li class="list-group-item">
								<span class="badge badge-danger float-right">danger</span>
								Morbi leo risus
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
		<div class="col-xl-4 col-lg-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Blue Grey Color</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">						
							<li><a data-action="reload"><i class="ft-rotate-cw"></i></a></li>							
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">						
					<p>Use class <code>.bg-COLOR</code> for background color.</p>
						<ul class="list-group">
							<li class="list-group-item bg-blue-grey white">
								Cras justo odio
							</li>
							<li class="list-group-item bg-blue-grey white">
								Dapibus ac facilisis in
							</li>
							<li class="list-group-item bg-blue-grey white">
								Morbi leo risus
							</li>
						</ul>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- With Other Option end -->

<!-- Links and buttons start -->
<section id="links-n-buttons">
	<div class="row">
		<div class="col-12 mt-3 mb-1">
			<h4 class="text-uppercase">Links and buttons</h4>
			<p>Use links or buttons to create actionable list group items with hover, disabled, and active states by adding .list-group-item-action.
				This separate class contains a few overrides to add compatibility for
				<code>&lt;a&gt;</code>s and
				<code>&lt;button&gt;</code>s, as well as the hover and focus states.</p>
			<div class="alert alert-danger">Be sure to
				<strong>not use</strong> the standard
				<strong>.btn</strong> classes here.</div>
		</div>
	</div>
	<div class="row match-height">
		<div class="col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Links</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li>
								<a data-action="collapse">
									<i class="ft-minus"></i>
								</a>
							</li>
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>
							<li>
								<a data-action="expand">
									<i class="ft-maximize"></i>
								</a>
							</li>
							<li>
								<a data-action="close">
									<i class="ft-x"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<div class="list-group">
							<a href="#" class="list-group-item active">
								Cras justo odio
							</a>
							<a href="#" class="list-group-item list-group-item-action">Dapibus ac facilisis in</a>
							<a href="#" class="list-group-item list-group-item-action">Morbi leo risus</a>
							<a href="#" class="list-group-item list-group-item-action">Porta ac consectetur ac</a>
							<a href="#" class="list-group-item list-group-item-action disabled">Vestibulum at eros</a>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Buttons</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li>
								<a data-action="collapse">
									<i class="ft-minus"></i>
								</a>
							</li>
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>
							<li>
								<a data-action="expand">
									<i class="ft-maximize"></i>
								</a>
							</li>
							<li>
								<a data-action="close">
									<i class="ft-x"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<div class="list-group">
							<button type="button" class="list-group-item list-group-item-action active">
								Cras justo odio
							</button>
							<button type="button" class="list-group-item list-group-item-action">Dapibus ac facilisis in</button>
							<button type="button" class="list-group-item list-group-item-action">Morbi leo risus</button>
							<button type="button" class="list-group-item list-group-item-action">Porta ac consectetur ac</button>
							<button type="button" class="list-group-item list-group-item-action disabled">Vestibulum at eros</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Links and buttons end -->

<!-- Custom Listgroups start -->
<section id="custom-listgroup">
	<div class="row">
		<div class="col-12 mt-3 mb-1">
			<h4 class="text-uppercase">Custom ListGroups</h4>
		</div>
	</div>
	<div class="row match-height">
		<div class="col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Contextual classes</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li>
								<a data-action="collapse">
									<i class="ft-minus"></i>
								</a>
							</li>
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>
							<li>
								<a data-action="expand">
									<i class="ft-maximize"></i>
								</a>
							</li>
							<li>
								<a data-action="close">
									<i class="ft-x"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<p>Use contextual classes to style list items, default or linked. Also includes <code>.active</code> state.</p>
						<div class="list-group">
							<a href="#" class="list-group-item list-group-item-action list-group-item-success">Dapibus ac facilisis in</a>
							<a href="#" class="list-group-item list-group-item-action list-group-item-info">Cras sit amet nibh libero</a>
							<a href="#" class="list-group-item list-group-item-action list-group-item-warning">Porta ac consectetur ac</a>
							<a href="#" class="list-group-item list-group-item-action list-group-item-danger">Vestibulum at eros</a>
						</div>
					</div>
				</div>
			</div>
		</div>
		<div class="col-lg-6 col-md-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Custom content</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li>
								<a data-action="collapse">
									<i class="ft-minus"></i>
								</a>
							</li>
							<li>
								<a data-action="reload">
									<i class="ft-rotate-cw"></i>
								</a>
							</li>
							<li>
								<a data-action="expand">
									<i class="ft-maximize"></i>
								</a>
							</li>
							<li>
								<a data-action="close">
									<i class="ft-x"></i>
								</a>
							</li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<p>Add nearly any HTML within, even for linked list groups like the one below.</p>
						<div class="list-group">
							<a href="#" class="list-group-item list-group-item-action flex-column align-items-start active">
								<div class="d-flex w-100 justify-content-between">
									<h5 class="text-bold-600 white">List group item heading</h5>
									<small>3 days ago</small>
								</div>
								<p>Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
								<small>Donec id elit non mi porta.</small>
							</a>
							<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
								<div class="d-flex w-100 justify-content-between">
									<h5 class="text-bold-600">List group item heading</h5>
									<small class="text-muted">3 days ago</small>
								</div>
								<p>Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
								<small class="text-muted">Donec id elit non mi porta.</small>
							</a>
							<a href="#" class="list-group-item list-group-item-action flex-column align-items-start">
								<div class="d-flex w-100 justify-content-between">
									<h5 class="text-bold-600">List group item heading</h5>
									<small class="text-muted">3 days ago</small>
								</div>
								<p>Donec id elit non mi porta gravida at eget metus. Maecenas sed diam eget risus varius blandit.</p>
								<small class="text-muted">Donec id elit non mi porta.</small>
							</a>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- Custom Listgroups end -->

<!-- JavaScript behavior start -->
<section id="javascript-behavior">
	<div class="row">
		<div class="col-12 mt-3 mb-1">
			<h4 class="text-uppercase">JavaScript behavior</h4>
			<p>Use the tab JavaScript plugin to extend our list group to create tabbable panes of local content.</p>
		</div>
	</div>
	<div class="row match-height">
		<div class="col-12">
			<div class="card">
				<div class="card-header">
					<h4 class="card-title">Links</h4>
					<a class="heading-elements-toggle">
						<i class="la la-ellipsis font-medium-3"></i>
					</a>
					<div class="heading-elements">
						<ul class="list-inline mb-0">
							<li><a data-action="collapse"><i class="ft-minus"></i></a></li>
							<li><a data-action="reload"><i class="ft-rotate-cw"></i></a></li>
							<li><a data-action="expand"><i class="ft-maximize"></i></a></li>
							<li><a data-action="close"><i class="ft-x"></i></a></li>
						</ul>
					</div>
				</div>
				<div class="card-content collapse show">
					<div class="card-body">
						<div class="row">
							<div class="col-lg-4 col-md-6 col-sm-12">
								<div class="list-group mb-2" id="list-tab" role="tablist">
									<a class="list-group-item list-group-item-action active" id="list-home-list" data-toggle="list" href="#list-home" role="tab">Home</a>
									<a class="list-group-item list-group-item-action" id="list-profile-list" data-toggle="list" href="#list-profile" role="tab">Profile</a>
									<a class="list-group-item list-group-item-action" id="list-messages-list" data-toggle="list" href="#list-messages" role="tab">Messages</a>
									<a class="list-group-item list-group-item-action" id="list-settings-list" data-toggle="list" href="#list-settings" role="tab">Settings</a>
								</div>
							</div>
							<div class="col-lg-8 col-md-6 col-sm-12">
								<div class="tab-content" id="nav-tabContent">
									<div class="tab-pane fade show active" id="list-home" role="tabpanel" aria-labelledby="list-home-list">
										<p>Velit aute mollit ipsum ad dolor consectetur nulla officia culpa adipisicing exercitation fugiat tempor. Voluptate deserunt sit sunt nisi aliqua fugiat proident ea ut. Mollit voluptate reprehenderit occaecat nisi ad non minim tempor sunt voluptate consectetur exercitation id ut nulla. Ea et fugiat aliquip nostrud sunt incididunt consectetur culpa aliquip eiusmod dolor. Anim ad Lorem aliqua in cupidatat nisi enim eu nostrud do aliquip veniam minim.</p>
										<p>Candy canes jelly marshmallow cookie cake tart. Croissant jelly icing biscuit lollipop sesame snaps chocolate bar carrot cake. Cake cotton candy wafer icing topping cotton candy. Brownie candy bear claw ice cream. Brownie apple pie caramels icing. Cheesecake candy sweet. Toffee cheesecake halvah jelly candy bonbon cookie oat cake cake. Dragée icing cupcake candy marshmallow icing. Cake dessert chocolate halvah jelly.</p>
										<p>Dessert jujubes chocolate bar apple pie. Croissant pie icing chupa chups dessert danish. Gummies candy icing cheesecake wafer marzipan donut carrot cake. Chocolate cake sugar plum donut gummi bears wafer. Toffee carrot cake gummi bears fruitcake. Chupa chups bonbon gingerbread tootsie roll biscuit. Tart bear claw cheesecake icing powder apple pie liquorice muffin. Lemon drops danish cookie cake.</p>
									</div>
									<div class="tab-pane fade" id="list-profile" role="tabpanel" aria-labelledby="list-profile-list">
										<p>Cupidatat quis ad sint excepteur laborum in esse qui. Et excepteur consectetur ex nisi eu do cillum ad laborum. Mollit et eu officia dolore sunt Lorem culpa qui commodo velit ex amet id ex. Officia anim incididunt laboris deserunt anim aute dolor incididunt veniam aute dolore do exercitation. Dolor nisi culpa ex ad irure in elit eu dolore. Ad laboris ipsum reprehenderit irure non commodo enim culpa commodo veniam incididunt veniam ad.</p>
										<p>Brownie sweet soufflé cotton candy fruitcake sugar plum candy gummies. Fruitcake jelly-o candy. Jujubes gummi bears jelly-o gummies biscuit chocolate cake tootsie roll marshmallow. Gummies candy macaroon. Cotton candy oat cake halvah. Macaroon bonbon macaroon. Muffin sweet roll donut candy cupcake pie marshmallow cookie sweet. Jelly pastry cheesecake bonbon lollipop dessert. Bear claw brownie sesame snaps muffin sweet roll macaroon cheesecake jelly.</p>
										<p>Jelly beans tootsie roll sugar plum bear claw powder tart wafer dessert tiramisu. Pastry pudding jelly beans. Candy muffin icing. Cake tootsie roll fruitcake croissant jujubes. Pastry donut pie. Icing wafer sweet roll bonbon macaroon jelly-o muffin pastry marshmallow.</p>
									</div>
									<div class="tab-pane fade" id="list-messages" role="tabpanel" aria-labelledby="list-messages-list">
										<p>Ut ut do pariatur aliquip aliqua aliquip exercitation do nostrud commodo reprehenderit aute ipsum voluptate. Irure Lorem et laboris nostrud amet cupidatat cupidatat anim do ut velit mollit consequat enim tempor. Consectetur est minim nostrud nostrud consectetur irure labore voluptate irure. Ipsum id Lorem sit sint voluptate est pariatur eu ad cupidatat et deserunt culpa sit eiusmod deserunt. Consectetur et fugiat anim do eiusmod aliquip nulla laborum elit adipisicing pariatur cillum.</p>
										<p>Cheesecake gummi bears liquorice lemon drops soufflé tiramisu caramels dragée. Dragée halvah dessert bonbon tootsie roll sweet liquorice. Sweet roll bonbon candy canes jelly gingerbread marzipan. Jelly sugar plum tootsie roll pie pudding lemon drops. Candy tiramisu gummies. Marshmallow liquorice liquorice powder chocolate bar tiramisu danish. Pastry gummies lollipop cheesecake croissant cupcake powder.</p>
										<p>Halvah tootsie roll jelly-o brownie chocolate cake cake macaroon jelly beans. Macaroon apple pie marshmallow halvah dessert toffee pie gummies. Tiramisu chocolate bar topping. Topping jelly-o candy candy canes. Tootsie roll pudding bonbon toffee tart soufflé biscuit caramels chocolate. Danish lollipop ice cream jujubes. Donut danish carrot cake soufflé apple pie lemon drops. Fruitcake candy canes tart bear claw croissant danish sesame snaps icing.</p>
									</div>
									<div class="tab-pane fade" id="list-settings" role="tabpanel" aria-labelledby="list-settings-list">
										<p>Irure enim occaecat labore sit qui aliquip reprehenderit amet velit. Deserunt ullamco ex elit nostrud ut dolore nisi officia magna sit occaecat laboris sunt dolor. Nisi eu minim cillum occaecat aute est cupidatat aliqua labore aute occaecat ea aliquip sunt amet. Aute mollit dolor ut exercitation irure commodo non amet consectetur quis amet culpa. Quis ullamco nisi amet qui aute irure eu. Magna labore dolor quis ex labore id nostrud deserunt dolor eiusmod eu pariatur culpa mollit in irure.</p>
										<p>Candy canes liquorice sweet topping. Tootsie roll tootsie roll caramels biscuit powder. Tiramisu cupcake marshmallow brownie dragée croissant bonbon ice cream jelly. Carrot cake pudding pudding pastry jelly beans candy tiramisu jelly muffin. Chocolate cake oat cake jelly-o jelly tiramisu candy liquorice caramels. Chocolate bar cake fruitcake gingerbread. Sweet roll muffin apple pie marshmallow chupa chups. Jelly beans muffin jujubes. Danish dragée halvah gingerbread macaroon marzipan jelly beans.</p>
										<p>Tart dragée halvah sugar plum halvah pastry jelly chocolate. Cake dessert halvah marshmallow gingerbread cotton candy dessert cheesecake. Tiramisu pudding sugar plum powder lollipop sweet jelly beans topping icing. Chupa chups sugar plum candy sweet apple pie. Pastry soufflé jujubes oat cake tiramisu candy halvah chupa chups cotton candy. Jelly-o jelly-o tiramisu.</p>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
</section>
<!-- JavaScript behavior end -->
</div>

<script type="text/javascript">
	
</script>